<template>
    <div>
        <basic-container>
            <avue-crud :data="tableData" :option="tableOption"
                       :page.sync="page"
                       :table-loading="tableLoading"
                       @on-load="handleList"
                       @refresh-change="refreshChange"
                       @date-change="dateChange"
                       @row-save="handleSave"
                       @row-update="handleUpdate"
                       @row-del="handleDel"
                       ref="crud"
            >
                <template slot-scope="scope" slot="menu">
                    <el-button type="text" size="small" @click="openPosition(scope.row)">岗位</el-button>

                </template>

            </avue-crud>


            </user-position-dialog>
        </basic-container>
    </div>
</template>

<script>
    import {mapGetters} from "vuex";

    import {userOption} from "@/const/admin/adminTabelOption";

    import { list,del, update,add} from "@/api/iot/IotImages";

    export default {
        name: "user",
        data() {
            return {
                isOpen: false,
                rowDto: {},
                showNodeCheckbox: [],
                tableOption: userOption, //表格设置属性
                tableData: [], //表格的数据
                tablePage: 1,
                menuData: [],
                positionData: [],
                tableLoading: false,
                tableObj: {},
                page: {
                    total: 0, //总页数
                    currentPage: 1, //当前页数
                    pageSize: 10 //每页显示多少条
                },
                grade: {
                    box: false,
                    check: []
                }
            };
        },
        created() {
            this.handleList();
        },
        computed: {
            ...mapGetters(["permission", "menuAll"])
        },
        methods: {
            openPosition(row) {
                this.isOpen = true;
                this.rowDto = row;
                this.showNodeCheckbox = row.positionList
            },
            handleSubmit(data, done) {
                let users = {};
                users = this.rowDto;
                let dto = {
                    user: users,
                    positionList: data.checkedKeys
                };

                setTimeout(() => {
                    this.rowDto = {};
                    done();
                }, 2000);
            },

            refreshChange(data) {
                this.handleList(data.page, data.searchForm)
            },
            dateChange(date) {
                this.$message.success(date);
            },
            /**
             * @title 获取字典
             * @detail 调用crud的findByvalue方法即可
             *
             **/
            findByvalue(dic, value) {
                return this.$refs.crud.findByvalue(dic, value);
            },
            /**
             * @title 打开新增窗口
             * @detail 调用crud的handleadd方法即可
             *
             **/
            handleAdd() {
                this.$refs.crud.rowAdd();
            },
            /**
             * @title 获取数据
             * @detail 赋值为tableData表格即可
             *
             **/
            handleList(page, searchDto) {
                let dto = {
                    page: 1,
                    limit: 10
                };
                if (page) {
                    dto.page = page.currentPage;
                    dto.limit = page.pageSize;
                }
                if (searchDto) {
                    dto.data = searchDto;
                }

                this.tableLoading = true;
                list(dto).then(res => {
                    const data = res.data.data;
                    // setTimeout(() => {
                    this.tableData = data.list;
                    this.page.total = data.total;
                    this.page.currentPage = data.pages;
                    this.tableLoading = false;
                    // }, 1000);
                });
            },
            /**
             * @title 数据添加
             * @param row 为当前的数据
             * @param done 为表单关闭函数
             *
             **/
            handleSave(row, done) {
                const dto = row;
                add(dto).then(res => {
                    this.$message({
                        showClose: true,
                        message: "操作成功:" + res.data.message,
                        type: "success"
                    });
                }).catch(err => {
                    this.$message.error("网络异常:" + err)
                });

                done();
            },
            /**
             * @title 数据删除
             * @param row 为当前的数据
             * @param index 为当前更新数据的行数
             *
             **/
            handleDel(row, index) {
                let dto = row;
                this.$confirm(`是否确认删除序号为${row.name}`, "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {

                        del(dto.id).then(res => {
                            this.$message({
                                showClose: true,
                                message: "操作成功:" + res.data.message,
                                type: "success"
                            });
                        }).catch(err => {
                            this.$message.error("网络异常:" + err)
                        });

                    })
                    .catch(() => {
                    });
            },
            /**
             * @title 数据更新
             * @param row 为当前的数据
             * @param index 为当前更新数据的行数
             * @param done 为表单关闭函数
             *
             **/
            handleUpdate(row, index, done) {
                const dto = row;
                update(dto).then(res => {
                    this.$message({
                        showClose: true,
                        message: "操作成功:" + res.data.message,
                        type: "success"
                    });
                }).catch(err => {
                    this.$message.error("网络异常:" + err)
                });
                done();
            },
            positionClick(data) {
                // console.log(data)
            },
            deptNodeClick(data) {
                let dto = {
                    deptId: data.id
                };
            },
            positionNodeClick(data) {
                let dto = {
                    positionId: data.id
                };
            }
        }
    };
</script>

<style lang="scss" scoped>
    .table-container {
        padding: 8px 10px;
    }
</style>
